<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<div id="box">
<input type="button" value="按钮" id="btn" onclick="showmessage()" />
<input type="button" value="按钮" id="btn2" />
<input type="button" value="按钮" id="btn3" />
</div>
<script>
function showmessage(event)
{
	alert(event.target.nodeName);//获取事件目标
	alert(event.type);//获取事件类型
	event.stopPropagation();
	}
	function showbox()
	{
		alert('这是放按钮的盒子')
		}
	
	var btn2=document.getElementById('btn2');
	var btn3=document.getElementById('btn3');
	var box = document.getElementById('box');
	btn2.onclick=function()
	{
		alert('hello world!');
		}
	/*btn3.addEventListener('click',showmessage,false);
	  btn3.removeEventListener('click',showmessage,false); 
	btn3.addEventListener('click',function(){
		alert(this.value)
		},false);
	btn3.attachEvent('onclick',showmessage);
	btn3.detachEvent('onclick',showmessage);*/
    //跨浏览器处理事件
    var eventUtil={
//添加句柄
    addHandler:function(element,type,handler)
    {
if (element.addEventListener) 
{
	element.addEventListener(type,handler,false);
}
	else if (element.attachEvent) 
	{
		element.attachEvent('on'+type,handler);
	}
		else
		{
			element['on'+click]=handler;
		}
    },
    //删除句柄
    removeHandler:function(element,type,handler)
    {
if (element.removeEventListener) 
{
	element.removeEventListener(type,handler,false);
}
	else if (element.detachEvent) 
	{
		element.detachEvent('on'+type,handler);
	}
		else
		{
			element['on'+click]=null;
		}
    },
    }
    eventUtil.addHandler(btn3,'click',showmessage);
	eventUtil.addHandler(btn3,'click',showbox);
    /*eventUtil.removeHandler(btn3,'click',showmessage);*/
</script>
</body>
</html>
